                    <aside class="widget animated fast fadeIn" data-showonscroll="true" data-animation="fadeIn">
                        <div class="widget-title clearfix">
                            <h3>Recent Comments [<?php echo $numberOfComment;?>]</h3>
                            <div class="sep-widget"></div>
                        </div>

                        <div class="widget-content clearfix">
                            <div class="wdg-comments clearfix">
                                <ul class="list-unstyled">
                                    <li class="post-item">
                                        <article class="post-box clearfix">
                                            <div class="wdg-col-4 sec-image">

                                                <div class="avatar-thumbnail border-radius-2px">
                                                    <img class="border-radius-2px" src="" data-src="holder.js/70x65/sky" alt="70x65" style="width: 70px; height: 65px;">
                                                </div>

                                                <a href="#" class="more"></a>
                                            </div>

                                            <div class="wdg-col-8 sec-title">
                                                <div class="meta-info">
                                                    <span class="date-time"><i class="icon-alarm2"></i>14 Aug 2013, 05:15 AM</span>
                                                </div>

                                                <div class="comment">
                                                    <h5>Serpentsoft</h5>
                                                    <span class="separator"></span>
                                                    <p>Excellent Cellphone</p>
                                                </div>

                                                <div class="leave-comment">
                                                    <a href="#">Leave Comment</a>
                                                </div>
                                            </div>
                                        </article>
                                    </li>

                                    <li class="post-item">
                                        <article class="post-box clearfix">
                                            <div class="wdg-col-4 sec-image">

                                                <div class="avatar-thumbnail border-radius-2px">
                                                    <img class="border-radius-2px" src="" data-src="holder.js/70x65/sky" alt="70x65" style="width: 70px; height: 65px;">
                                                </div>

                                                <a href="#" class="more"></a>
                                            </div>

                                            <div class="wdg-col-8 sec-title">
                                                <div class="meta-info">
                                                    <span class="date-time"><i class="icon-alarm2"></i>14 Aug 2013, 05:15 AM</span>
                                                </div>

                                                <div class="comment">
                                                    <h5>Mostafa</h5>
                                                    <span class="separator"></span>
                                                    <p>Hi everybody, I like Four theme very much...</p>
                                                </div>

                                                <div class="leave-comment">
                                                    <a href="#">Leave Comment</a>
                                                </div>
                                            </div>
                                        </article>
                                    </li>

                                    <!--<li class="post-item">
                                        <article class="post-box clearfix">
                                            <div class="wdg-col-4 sec-image">

                                                <div class="avatar-thumbnail border-radius-2px">
                                                    <img class="border-radius-2px" src="" data-src="holder.js/70x65/sky" alt="70x65" style="width: 70px; height: 65px;">
                                                </div>

                                                <a href="#" class="more"></a>
                                            </div>

                                            <div class="wdg-col-8 sec-title">
                                                <div class="meta-info">
                                                    <span class="date-time"><i class="icon-alarm2"></i>14 Aug 2013, 05:15 AM</span>
                                                </div>

                                                <div class="comment">
                                                    <h5>Mohammad</h5>
                                                    <span class="separator"></span>
                                                    <p>Progress Colors depending on the ratio! That's Nice...</p>
                                                </div>

                                                <div class="leave-comment">
                                                    <a href="#">Leave Comment</a>
                                                </div>
                                            </div>
                                        </article>-->
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </aside>